import Vue from 'vue/dist/vue.js';
import VueAxiosPlugin from 'vue-axios-plugin';
import Vuex from 'vuex';
Vue.use(Vuex);
const checkStatus = (response) => {
    if(response.status === 404){
        console.log(response.status)
    }
    if(response.status === 500){
        console.log(response.status)
    }

    // after your uniform request handler, you must return response
    return response
};
Vue.use(VueAxiosPlugin, {
    checkStatus: checkStatus
});
let textType = (function () {
/*
* 专为传输文本文件设计
* */
    let textType_unit = {
        store:new Vuex.Store({
            state: {
                uploadFileNum:0
            },
            mutations: {
                uploadFileNumIncrease: (state)=> {
                    state.uploadFileNum++;
                },
                uploadFileNumReduce: (state)=> {
                    state.uploadFileNum--;
                }
            },
            getters:{
                getUploadFileNumData:(state)=>{
                    return state.uploadFileNum;
                }
            }
        }),
    };
    let component = {
        props:['propsStyle'],
        template:
        '<div id="textType" :style=[textTypeStyle,propsStyle]>' +
            '<form id="textFileForm" accept-charset="UTF-8" action="/textUpload" method="post" enctype="multipart/form-data" :style=[inputStyle]>选择要上传的文章: '+
                '<input name="myForm" type="file" :style=[inputStyle] />' +
            '</form>'+
            '<button type="button" :style=[buttonStyle] name="upload" @click="upload">upload</button>'+
        '</div>',
        data:function () {
            return {
                textTypeStyle:{
                    position:'relative',
                    display:'inline-block',
                    backgroundColor:'#005102',
                },
                inputStyle:{
                    color:'#ffffff'
                },
                inputStyle2:{
                    color:'#000000'
                },
                buttonStyle:{
                    width:65+'px',
                    height:25+'px'
                }
            }
        },
        methods:{
            emit:function (uri,formID) {
                /*
                * uri:后端的接收路径
                * formID:form表单的id
                * */
                let _this = this;
                let htmlForm = document.getElementById(formID);
                this.$axios.post(uri,new FormData(htmlForm)).then(function (res) {
                    textType_unit.store.commit('uploadFileNumReduce');
                    _this.uploadOk();
                });
                textType_unit.store.commit('uploadFileNumIncrease');

            },
            upload:function () {
                /*负责上传文件*/
                let uri = 'textUpload/coffeCat/';
                console.log(uri);
                this.emit(uri,'textFileForm');
            },
            uploadOk:function () {
                if(textType_unit.store.getters.getUploadFileNumData===0){
                    console.log('text upload ok');
                }
            }
        }
    };

    return {
        name:'text-type',
        component:component
    }
})();

export default textType;